<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title th:text="#{login.title}">用户登录</title>
    <link th:href="@{/css/login.css}" rel="stylesheet">
</head>
<body>
<div class="auth-wrapper">
    <div class="lang-switch">
        <a th:href="@{/toLoginPage(l='zh_CN')}" class="lang-option">中文</a>
        <a th:href="@{/toLoginPage(l='en_US')}" class="lang-option">English</a>
    </div>
    <div class="auth-card">
        <div class="brand-header">
            <div class="logo-circle">
                <img th:src="@{/img/logo3.png}" alt="Logo" class="logo-image">
            </div>
        </div>
        <h2 class="auth-heading" th:text="#{login.title}">用户登录</h2>
        <form class="auth-form">
            <div class="input-field">
                <input type="text" th:placeholder="#{login.username.placeholder}" class="auth-input" required>
            </div>
            <div class="input-field">
                <input type="password" th:placeholder="#{login.password.placeholder}" class="auth-input" required>
            </div>
            <label class="remember-section">
                <input type="checkbox"><span th:text="#{login.rememberMe}"></span>
            </label>
            <button type="submit" class="submit-btn" th:text="#{login.button}">登录</button>
        </form>
        <div class="footer-info">
            © <span th:text="${currentYear}">2025</span>-<span th:text="${currentYear}+1">2026</span>
        </div>
    </div>
</div>
</body>
</html>